<template>
	<view class="container">
		<view class="tabCon">
			<tabs acctiveText border="#ed413b" @tabClick="typeChange" :tabs="types"></tabs>
		</view>
		<block v-if="comments.length">


			<view class="commentItem" v-for="(item , index) in comments" :key="index">
				<view class="userBox">
					<image :src="item.userPhoto" class="userPic" mode="aspectFit"></image>
					<view>
						<view class="userName">
							{{item.loginName}}
							<text class="isvip">会员</text>
						</view>
						<view class="createTime">
							<uni-rate size="12" value="5"></uni-rate>
							<text style="margin-left: 10px;">{{item.createTime}}</text>
						</view>
					</view>
				</view>
				<!-- <block v-if="item.comment"> -->
				<commentDetail :comment="item.comment"></commentDetail>
				<!-- </block> -->
			</view>
		</block>
		<empty v-else emptyText="无对应评论"></empty>
	</view>
</template>

<script>
	import uniRate from '@/components/uni-rate/uni-rate.vue'
	import tabs from "@/components/scrollTab/scrollTab.vue"
	import commentDetail from "@/components/commentDetail/commentDetail.vue"
	import empty from "@/components/empty.vue"
	export default {
		components: {
			uniRate,
			commentDetail,
			empty,
			tabs
		},
		data() {
			return {
				types: ['全部', '好评', '中评', '差评', '晒图'],
				goodsId: 0,
				currentPage: 1,
				total: 1,
				type: '',
				comments: []
			};
		},
		onLoad(options) {
			if (options.goodsId) {
				this.goodsId = options.goodsId
				this.loadComments()
			}
		},
		onReachBottom() {
			this.currentPage++
			this.loadComments()
		},
		methods: {
			// 筛选评价类型
			typeChange(item) {
				let index = item.index
				switch (index) {
					case 0:
						this.type = ''
						break;
					case 1:
						this.type = 'best'
						break;
					case 2:
						this.type = 'good'
						break;
					case 3:
						this.type = 'bad'
						break;
					case 4:
						this.type = 'pic'
						break;
				}
				this.currentPage = 1
				this.loadComments()
			},
			/* 加载评论数据 */
			loadComments() {
				let that = this
				if (that.currentPage == 1) {
					that.comments = []
				}
				if (that.currentPage > that.total) {
					that.$api.msg('没有更多了')
					return
				}
				that.$Request.request('/api/goods/goodsAppraisesList', 'POST', {
					goodsId: that.goodsId,
					type: that.type,
					offset: that.currentPage
				}).then(res => {
					if (res.status == 1) {
						console.log(res)
						if (res.data) {
							that.total = parseInt(res.data.last_page)
							res.data.data.forEach(item => {
								let comment = {
									commetnText: item.content,
									expressRate: item.timeScore,
									serviceRate: item.serviceScore,
									goodsRate: item.goodsScore,
									imgs: item.images
								}
								let unit = item
								unit.comment = comment
								that.comments.push(unit)
							})
						}
					}
					
				}).catch(err => {
					console.log(err)
				})
			}
		}
	}
</script>

<style lang="scss">
	@import "./productComments.scss"
</style>
